<template>
  <div class="app-container">
    <page-header
      title="交易统计"
      desc="商城统计最新情报及相关设置"
    />
    <el-container>
      <el-main>
        <el-calendar v-model="value">
          <template
            slot="dateCell"
            slot-scope="{date, data}"
          >
            <p :class="data.isSelected ? 'is-selected' : ''">
              {{ data.day.split('-').slice(1).join('-') }} {{ data.isSelected ? '✔️' : '' }}
            </p>
            {{ $moment(date) }}
          </template>
        </el-calendar>
      </el-main>
      <el-aside width="200px">
        {{ value }}
      </el-aside>
    </el-container>
  </div>
</template>
<script>
import PageHeader from '@/components/PageHeader'
export default {
  components: {
    PageHeader
  },
  data() {
    return {
      value: new Date()
    }
  },
  methods: {
    // 是否选中日期
    isSelected: function(slotDate, slotData) {
      return this.selectedDates.includes(slotData.day)
    },
    // 是否节假日
    isFestival(slotDate, slotData) {
      // 公历节日\农历节日\农历节气
      let festAndTerm = []
      festAndTerm = festAndTerm.join('')

      return festAndTerm !== ''
    }
  }
}
</script>
